﻿<template>
    <el-container>
        <el-main>
            <el-form ref="form"
                     :model="data"
                     :rules="formRules"
                     label-width="80px">

                <el-form-item :label="$l('ProductTypeTypeName')"
                              prop="typeName">
                    <el-input v-model="data.typeName"></el-input>
                </el-form-item>

                <el-form-item :label="$l('ProductTypeRemark')"
                              prop="remark">
                    <el-input v-model="data.remark"
                              type="textarea"></el-input>
                </el-form-item>

            </el-form>
        </el-main>
        <el-footer style="text-align:right;">
            <el-button @click="$emit('cancel')">取消</el-button>
            <el-button type="primary" @click="onSave">保存</el-button>
        </el-footer>
    </el-container>
</template>

<script>
    export default {
        props: ['id'],
        data() {
            return {
                data: {},
                formRules: {
                    userName: [
                        { required: true, message: '请输入用户名称', trigger: 'blur' }
                    ]
                }
            }
        },
        mounted() {
            var self = this;
            self.refresh(self.id);
        },
        methods: {
            refresh() {
                var self = this;
                self.$http
                    .get('/api/app/productType/' + self.id)
                    .then((res) => {
                        self.data = res;
                    });
            },
            onSave() {
                var self = this;
                self.$refs.form.validate((valid) => {
                    if (valid) {
                        if (self.id === '') {
                            self.$http
                                .post('/api/app/productType', self.data)
                                .then(onSaveSuccess)
                                .catch(onSaveError);
                        } else {
                            self.$http
                                .put('/api/app/productType/' + self.id, self.data)
                                .then(onSaveSuccess)
                                .catch(onSaveError);
                        }
                    } else {
                        return false;
                    }
                });

                function onSaveSuccess(res) {
                    self.$emit("change", res);
                }
                function onSaveError(error) {
                    var _error = error.response.data.error;
                    var msg = _error.message;
                    if (_error.details !== null) {
                        msg += '\n' + _error.details;
                    }

                    self.$message({
                        message: msg,
                        type: 'error'
                    });
                }
            },

        }
    }
</script>

<style scoped>
</style>